<template>
  <detailbox :title="detailId ? '重新编辑' : '新增'" @leftclick="close">
    <div slot="right" class="flex_item flex_end">
      <div class="flex_end"><el-button type="primary" size="small" @click="submit()">提交</el-button></div>
    </div>
    <basic-container>
      <el-form size="small" model="form" label-position="left" inline ref="form">
        <el-row>
          <el-form-item
            label="求购消息标题"
            :rules="[{ required: true, message: '请输入消息标题', trigger: 'blur' }, { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }]"
          >
            <el-input v-model="form.title" placeholder="请输入"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="联系公司" :rules="[{ required: true, message: '请输入联系公司', trigger: 'blur' }]">
            <el-input v-model="form.company" placeholder="请输入"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="联系人" :rules="[{ required: true, message: '请输入联系人', trigger: 'blur' }]">
            <el-input v-model="form.name" placeholder="请输入"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="联系电话"  :rules="[{ required: true, message: '请输入联系电话', trigger: 'blur' }, { type: 'number', message: '请输入正确的联系电话', trigger: ['blur', 'change'] }]"><el-input v-model="form.phone" placeholder="请输入"></el-input></el-form-item>
        </el-row>
        <avue-ueditor v-model="form.content" :options="options"></avue-ueditor>
      </el-form>
    </basic-container>
  </detailbox>
</template>

<script>
import { getinfobuydetail, getinfobuysave, getinfobuyupdate } from '@/api/myapi/common.js';
export default {
  props: {
    detailId: ''
  },
  data() {
    return {
      options: {},
      form: {
        title: '',
        company: '', // 公司
        content: '',
        name: '', //  人
        phone: '' //  联系方式
      }
    };
  },
  mounted() {
    if (this.detailId) {
      this.getDetail();
    }
  },
  methods: {
    close() {
      this.$emit('close');
    },
    getDetail() {
      getinfobuydetail({
        id: this.detailId
      }).then(({ data }) => {
        if (data & data.success) {
          this.form = data.data;
        }
      });
    },
    submit() {
      this.$refs.form.validate(valid => {
        if (valid) {
          alert('submit!');
          this.$emit('success');
        }
      });
    },
    resetForm() {
      this.$refs.form.resetFields();
    }
  }
};
</script>

<style></style>
